<template>
  <div class="no-vue3-cron-div">
    <el-tabs type="border-card">
      <!-- 秒 -->
      <el-tab-pane v-if="!hideArr.includes('Seconds')">
        <template #label>
          <span>
            <i class="el-icon-date"></i>
            {{ $t("cron.Seconds.name") }}
          </span>
        </template>
        <div
          class="tabBody myScroller"
          :style="!!maxHeight ? { 'max-height': maxHeight } : {}"
        >
          <el-row>
            <el-radio v-model="state.second.cronEvery" label="1"
              >{{ $t("cron.Seconds.every") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.second.cronEvery" label="2">
              {{ $t("cron.Seconds.interval.0") }}
              {{ $t("cron.Seconds.interval.0") }}
              <el-input-number
                v-model="state.second.incrementIncrement"
                :min="1"
                :max="60"
              ></el-input-number>
              {{ $t("cron.Seconds.interval.1") }}
              <el-input-number
                v-model="state.second.incrementStart"
                :min="0"
                :max="59"
              ></el-input-number>
              {{ $t("cron.Seconds.interval.2") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio class="long" v-model="state.second.cronEvery" label="3">
              {{ $t("cron.Seconds.specific") }}
            </el-radio>
            <el-select
              multiple
              v-model="state.second.specificSpecific"
              @change="state.second.cronEvery = '3'"
            >
              <el-option
                v-for="(val, index) in 60"
                :key="index"
                :value="val - 1"
                >{{ val - 1 }}
              </el-option>
            </el-select>
          </el-row>
          <el-row>
            <el-radio v-model="state.second.cronEvery" label="4"
              >{{ $t("cron.Seconds.cycle.0") }}
              <el-input-number
                v-model="state.second.rangeStart"
                :min="1"
                :max="60"
              ></el-input-number>
              {{ $t("cron.Seconds.cycle.1") }}
              <el-input-number
                v-model="state.second.rangeEnd"
                :min="0"
                :max="59"
              ></el-input-number>
              {{ $t("cron.Seconds.cycle.1") }}
            </el-radio>
          </el-row>
        </div>
      </el-tab-pane>
      <!-- 分 -->
      <el-tab-pane v-if="!hideArr.includes('Minutes')">
        <template #label>
          <span
            ><i class="el-icon-date"></i> {{ $t("cron.Minutes.name") }}</span
          >
        </template>
        <div
          class="tabBody myScroller"
          :style="!!maxHeight ? { 'max-height': maxHeight } : {}"
        >
          <el-row>
            <el-radio v-model="state.minute.cronEvery" label="1"
              >{{ $t("cron.Minutes.every") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.minute.cronEvery" label="2"
              >{{ $t("cron.Minutes.interval.0") }}
              <el-input-number
                v-model="state.minute.incrementIncrement"
                :min="1"
                :max="60"
              ></el-input-number>
              {{ $t("cron.Minutes.interval.1") }}
              <el-input-number
                v-model="state.minute.incrementStart"
                :min="0"
                :max="59"
              ></el-input-number>
              {{ $t("cron.Minutes.interval.2") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio class="long" v-model="state.minute.cronEvery" label="3"
              >{{ $t("cron.Minutes.specific") }}
            </el-radio>
            <el-select
              multiple
              v-model="state.minute.specificSpecific"
              @change="state.minute.cronEvery = '3'"
            >
              <el-option
                v-for="(val, index) in 60"
                :key="index"
                :value="val - 1"
                >{{ val - 1 }}
              </el-option>
            </el-select>
          </el-row>
          <el-row>
            <el-radio v-model="state.minute.cronEvery" label="4"
              >{{ $t("cron.Minutes.cycle.0") }}
              <el-input-number
                v-model="state.minute.rangeStart"
                :min="1"
                :max="60"
              ></el-input-number>
              {{ $t("cron.Minutes.cycle.1") }}
              <el-input-number
                v-model="state.minute.rangeEnd"
                :min="0"
                :max="59"
              ></el-input-number>
              {{ $t("cron.Minutes.cycle.2") }}
            </el-radio>
          </el-row>
        </div>
      </el-tab-pane>
      <!-- 时 -->
      <el-tab-pane v-if="!hideArr.includes('Hours')">
        <template #label>
          <span><i class="el-icon-date"></i> {{ $t("cron.Hours.name") }}</span>
        </template>
        <div
          class="tabBody myScroller"
          :style="!!maxHeight ? { 'max-height': maxHeight } : {}"
        >
          <el-row>
            <el-radio v-model="state.hour.cronEvery" label="1"
              >{{ $t("cron.Hours.every") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.hour.cronEvery" label="2"
              >{{ $t("cron.Hours.interval.0") }}
              <el-input-number
                v-model="state.hour.incrementIncrement"
                :min="0"
                :max="23"
              ></el-input-number>
              {{ $t("cron.Hours.interval.1") }}
              <el-input-number
                v-model="state.hour.incrementStart"
                :min="0"
                :max="23"
              ></el-input-number>
              {{ $t("cron.Hours.interval.2") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio class="long" v-model="state.hour.cronEvery" label="3"
              >{{ $t("cron.Hours.specific") }}
            </el-radio>
            <el-select
              multiple
              v-model="state.hour.specificSpecific"
              @change="state.hour.cronEvery = '3'"
            >
              <el-option
                v-for="(val, index) in 24"
                :key="index"
                :value="val - 1"
                >{{ val - 1 }}
              </el-option>
            </el-select>
          </el-row>
          <el-row>
            <el-radio v-model="state.hour.cronEvery" label="4"
              >{{ $t("cron.Hours.cycle.0") }}
              <el-input-number
                v-model="state.hour.rangeStart"
                :min="0"
                :max="23"
              ></el-input-number>
              {{ $t("cron.Hours.cycle.1") }}
              <el-input-number
                v-model="state.hour.rangeEnd"
                :min="0"
                :max="23"
              ></el-input-number>
              {{ $t("cron.Hours.cycle.2") }}
            </el-radio>
          </el-row>
        </div>
      </el-tab-pane>
      <!-- 天 -->
      <el-tab-pane v-if="!hideArr.includes('Day')">
        <template #label>
          <span><i class="el-icon-date"></i> {{ $t("cron.Day.name") }}</span>
        </template>
        <div
          class="tabBody myScroller"
          :style="!!maxHeight ? { 'max-height': maxHeight } : {}"
        >
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="1"
              >{{ $t("cron.Day.every") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="2"
              >{{ $t("cron.Day.intervalWeek.0") }}

              <el-input-number
                v-model="state.week.incrementIncrement"
                :min="1"
                :max="7"
              ></el-input-number>
              {{ $t("cron.Day.intervalWeek.1") }}
              <el-select
                v-model="state.week.incrementStart"
                @change="state.day.cronEvery = '2'"
              >
                <el-option
                  v-for="(val, index) in 7"
                  :key="index"
                  :label="$t(`cron.Week.${index}`)"
                  :value="val"
                ></el-option>
              </el-select>
              {{ $t("cron.Day.intervalWeek.2") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="3"
              >{{ $t("cron.Day.intervalDay.0") }}
              <el-input-number
                v-model="state.day.incrementIncrement"
                :min="1"
                :max="31"
              ></el-input-number>
              {{ $t("cron.Day.intervalDay.1") }}
              <el-input-number
                v-model="state.day.incrementStart"
                :min="1"
                :max="31"
              ></el-input-number>
              {{ $t("cron.Day.intervalDay.2") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio class="long" v-model="state.day.cronEvery" label="4"
              >{{ $t("cron.Day.specificWeek") }}
            </el-radio>
            <el-select
              multiple
              v-model="state.week.specificSpecific"
              @change="state.day.cronEvery = '4'"
            >
              <el-option
                v-for="(val, index) in 7"
                :key="index"
                :label="$t(`cron.Week.${index}`)"
                :value="
                  ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT'][val - 1]
                "
              ></el-option>
            </el-select>
          </el-row>
          <el-row>
            <el-radio class="long" v-model="state.day.cronEvery" label="5"
              >{{ $t("cron.Day.specificDay") }}
            </el-radio>
            <el-select
              multiple
              v-model="state.day.specificSpecific"
              @change="state.day.cronEvery = '5'"
            >
              <el-option v-for="(val, index) in 31" :key="index" :value="val"
                >{{ val }}
              </el-option>
            </el-select>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="6"
              >{{ $t("cron.Day.lastDay") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="7"
              >{{ $t("cron.Day.lastWeekday") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="8"
              >{{ $t("cron.Day.lastWeek.0") }}
              <el-select
                v-model="state.day.cronLastSpecificDomDay"
                @change="state.day.cronEvery = '8'"
              >
                <el-option
                  v-for="(val, index) in 7"
                  :key="index"
                  :label="$t(`cron.Week.${index}`)"
                  :value="val"
                ></el-option>
              </el-select>
              {{ $t("cron.Day.lastWeek.0") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="9">
              <el-input-number
                v-model="state.day.cronDaysBeforeEomMinus"
                :min="1"
                :max="31"
              ></el-input-number>
              {{ $t("cron.Day.beforeEndMonth.0") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="10"
              >{{ $t("cron.Day.nearestWeekday.0") }}
              <el-input-number
                v-model="state.day.cronDaysNearestWeekday"
                :min="1"
                :max="31"
              ></el-input-number>
              {{ $t("cron.Day.nearestWeekday.1") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.day.cronEvery" label="11"
              >{{ $t("cron.Day.someWeekday.0") }}
              <el-input-number
                v-model="state.week.cronNthDayNth"
                :min="1"
                :max="5"
              ></el-input-number>
              <el-select
                v-model="state.week.cronNthDayDay"
                @change="state.day.cronEvery = '11'"
              >
                <el-option
                  v-for="(val, index) in 7"
                  :key="index"
                  :label="$t(`cron.Week.${index}`)"
                  :value="val"
                ></el-option>
              </el-select>
              {{ $t("cron.Day.someWeekday.1") }}
            </el-radio>
          </el-row>
        </div>
      </el-tab-pane>
      <!-- 月 -->
      <el-tab-pane v-if="!hideArr.includes('Month')">
        <template #label>
          <span><i class="el-icon-date"></i> {{ $t("cron.Month.name") }}</span>
        </template>
        <div
          class="tabBody myScroller"
          :style="!!maxHeight ? { 'max-height': maxHeight } : {}"
        >
          <el-row>
            <el-radio v-model="state.month.cronEvery" label="1"
              >{{ $t("cron.Month.every") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.month.cronEvery" label="2"
              >{{ $t("cron.Month.interval.0") }}
              <el-input-number
                v-model="state.month.incrementIncrement"
                :min="0"
                :max="12"
              ></el-input-number>
              {{ $t("cron.Month.interval.1") }}
              <el-input-number
                v-model="state.month.incrementStart"
                :min="0"
                :max="12"
              ></el-input-number>
            </el-radio>
          </el-row>
          <el-row>
            <el-radio class="long" v-model="state.month.cronEvery" label="3"
              >{{ $t("cron.Month.specific") }}
            </el-radio>
            <el-select
              multiple
              v-model="state.month.specificSpecific"
              @change="state.month.cronEvery = '3'"
            >
              <el-option
                v-for="(val, index) in 12"
                :key="index"
                :label="val"
                :value="val"
              ></el-option>
            </el-select>
          </el-row>
          <el-row>
            <el-radio v-model="state.month.cronEvery" label="4"
              >{{ $t("cron.Month.cycle.0") }}
              <el-input-number
                v-model="state.month.rangeStart"
                :min="1"
                :max="12"
              ></el-input-number>
              {{ $t("cron.Month.cycle.1") }}
              <el-input-number
                v-model="state.month.rangeEnd"
                :min="1"
                :max="12"
              ></el-input-number>
            </el-radio>
          </el-row>
        </div>
      </el-tab-pane>
      <!-- 年 -->
      <el-tab-pane v-if="!hideArr.includes('Year')">
        <template #label>
          <span><i class="el-icon-date"></i> {{ $t("cron.Year.name") }}</span>
        </template>
        <div
          class="tabBody myScroller"
          :style="!!maxHeight ? { 'max-height': maxHeight } : {}"
        >
          <el-row>
            <el-radio v-model="state.year.cronEvery" label="1"
              >{{ $t("cron.Year.every") }}
            </el-radio>
          </el-row>
          <el-row>
            <el-radio v-model="state.year.cronEvery" label="2"
              >{{ $t("cron.Year.interval.0") }}
              <el-input-number
                v-model="state.year.incrementIncrement"
                :min="1"
                :max="99"
              ></el-input-number>
              {{ $t("cron.Year.interval.1") }}
              <el-input-number
                v-model="state.year.incrementStart"
                :min="2018"
                :max="2118"
              ></el-input-number>
            </el-radio>
          </el-row>
          <el-row>
            <el-radio class="long" v-model="state.year.cronEvery" label="3"
              >{{ $t("cron.Year.specific") }}
            </el-radio>
            <el-select
              filterable
              multiple
              v-model="state.year.specificSpecific"
              @change="state.year.cronEvery = '3'"
            >
              <el-option
                v-for="(val, index) in 100"
                :key="index"
                :label="2017 + val"
                :value="2017 + val"
              ></el-option>
            </el-select>
          </el-row>
          <el-row>
            <el-radio v-model="state.year.cronEvery" label="4"
              >{{ $t("cron.Year.cycle.0") }}
              <el-input-number
                v-model="state.year.rangeStart"
                :min="2018"
                :max="2118"
              ></el-input-number>
              {{ $t("cron.Year.cycle.1") }}
              <el-input-number
                v-model="state.year.rangeEnd"
                :min="2018"
                :max="2118"
              ></el-input-number>
            </el-radio>
          </el-row>
        </div>
      </el-tab-pane>
    </el-tabs>
    <el-divider content-position="left">{{
      $t("page.systemManageArr.executeRuleArr.cron")
    }}</el-divider>
    <span>{{ state.cron }}</span>
    <!-- 最近5次运行时间 -->
    <CronResult :ex="state.cron" />
  </div>
</template>
<script setup lang="ts">
import { object_Inf } from "@/utils/typings/index.type";
import { watch, reactive, computed, toRefs } from "vue";
import CronResult from "./cron-result/index.vue";

const emit = defineEmits(["close", "change"]);
const props = defineProps({
  cronValue: String,
  maxHeight: {
    type: String,
    requited: false,
    default: 0,
  },
  hideArr: {
    type: Array,
    requited: false,
    default: 0,
  },
});
const state: object_Inf = reactive({
  second: {
    cronEvery: "1",
    incrementStart: 3,
    incrementIncrement: 5,
    rangeStart: 0,
    rangeEnd: 0,
    specificSpecific: [],
  },
  minute: {
    cronEvery: "1",
    incrementStart: 3,
    incrementIncrement: 5,
    rangeStart: 0,
    rangeEnd: 0,
    specificSpecific: [],
  },
  hour: {
    cronEvery: "1",
    incrementStart: 3,
    incrementIncrement: 5,
    rangeStart: 0,
    rangeEnd: 0,
    specificSpecific: [],
  },
  day: {
    cronEvery: "1",
    incrementStart: 1,
    incrementIncrement: 1,
    rangeStart: 0,
    rangeEnd: 0,
    specificSpecific: [],
    cronLastSpecificDomDay: 1,
    cronDaysBeforeEomMinus: 0,
    cronDaysNearestWeekday: 0,
  },
  week: {
    cronEvery: "1",
    incrementStart: 1,
    incrementIncrement: 1,
    specificSpecific: [],
    cronNthDayDay: 1,
    cronNthDayNth: 1,
  },
  month: {
    cronEvery: "1",
    incrementStart: 3,
    incrementIncrement: 5,
    rangeStart: 0,
    rangeEnd: 0,
    specificSpecific: [],
  },
  year: {
    cronEvery: "1",
    incrementStart: 2017,
    incrementIncrement: 1,
    rangeStart: 0,
    rangeEnd: 0,
    specificSpecific: [],
  },
  output: {
    second: "",
    minute: "",
    hour: "",
    day: "",
    month: "",
    Week: "",
    year: "",
  },
  secondsText: computed(() => {
    let seconds = "";
    let cronEvery = state.second.cronEvery;
    switch (cronEvery.toString()) {
      case "1":
        seconds = "*";
        break;
      case "2":
        seconds =
          state.second.incrementStart + "/" + state.second.incrementIncrement;
        break;
      case "3":
        state.second.specificSpecific.map((val: string) => {
          seconds += val + ",";
        });
        seconds = seconds.slice(0, -1);
        break;
      case "4":
        seconds = state.second.rangeStart + "-" + state.second.rangeEnd;
        break;
    }
    return !props.hideArr.includes("Seconds") ? seconds : "0";
  }),
  minutesText: computed(() => {
    let minutes = "";
    let cronEvery = state.minute.cronEvery;
    switch (cronEvery.toString()) {
      case "1":
        minutes = "*";
        break;
      case "2":
        minutes =
          state.minute.incrementStart + "/" + state.minute.incrementIncrement;
        break;
      case "3":
        state.minute.specificSpecific.map((val: string) => {
          minutes += val + ",";
        });
        minutes = minutes.slice(0, -1);
        break;
      case "4":
        minutes = state.minute.rangeStart + "-" + state.minute.rangeEnd;
        break;
    }
    return !props.hideArr.includes("Minutes") ? minutes : "0";
  }),
  hoursText: computed(() => {
    let hours = "";
    let cronEvery = state.hour.cronEvery;
    switch (cronEvery.toString()) {
      case "1":
        hours = "*";
        break;
      case "2":
        hours = state.hour.incrementStart + "/" + state.hour.incrementIncrement;
        break;
      case "3":
        state.hour.specificSpecific.map((val: string) => {
          hours += val + ",";
        });
        hours = hours.slice(0, -1);
        break;
      case "4":
        hours = state.hour.rangeStart + "-" + state.hour.rangeEnd;
        break;
    }
    return !props.hideArr.includes("Hours") ? hours : "0";
  }),
  daysText: computed(() => {
    let days = "";
    let cronEvery = state.day.cronEvery;
    switch (cronEvery.toString()) {
      case "1":
        break;
      case "2":
      case "4":
      case "11":
        days = "?";
        break;
      case "3":
        days = state.day.incrementStart + "/" + state.day.incrementIncrement;
        break;
      case "5":
        state.day.specificSpecific.map((val: string) => {
          days += val + ",";
        });
        days = days.slice(0, -1);
        break;
      case "6":
        days = "L";
        break;
      case "7":
        days = "LW";
        break;
      case "8":
        days = state.day.cronLastSpecificDomDay + "L";
        break;
      case "9":
        days = "L-" + state.day.cronDaysBeforeEomMinus;
        break;
      case "10":
        days = state.day.cronDaysNearestWeekday + "W";
        break;
    }
    return !props.hideArr.includes("Day") ? days : "0";
  }),
  weeksText: computed(() => {
    let weeks = "";
    let cronEvery = state.day.cronEvery;
    switch (cronEvery.toString()) {
      case "1":
      case "3":
      case "5":
        weeks = "?";
        break;
      case "2":
        weeks = state.week.incrementStart + "/" + state.week.incrementIncrement;
        break;
      case "4":
        state.week.specificSpecific.map((val: string) => {
          weeks += val + ",";
        });
        weeks = weeks.slice(0, -1);
        break;
      case "6":
      case "7":
      case "8":
      case "9":
      case "10":
        weeks = "?";
        break;
      case "11":
        weeks = state.week.cronNthDayDay + "#" + state.week.cronNthDayNth;
        break;
    }
    return !props.hideArr.includes("Week") ? weeks : "0";
  }),
  monthsText: computed(() => {
    let months = "";
    let cronEvery = state.month.cronEvery;
    switch (cronEvery.toString()) {
      case "1":
        months = "*";
        break;
      case "2":
        months =
          state.month.incrementStart + "/" + state.month.incrementIncrement;
        break;
      case "3":
        state.month.specificSpecific.map((val: string) => {
          months += val + ",";
        });
        months = months.slice(0, -1);
        break;
      case "4":
        months = state.month.rangeStart + "-" + state.month.rangeEnd;
        break;
    }
    return !props.hideArr.includes("Month") ? months : "0";
  }),
  yearsText: computed(() => {
    let years = "";
    let cronEvery = state.year.cronEvery;
    switch (cronEvery.toString()) {
      case "1":
        years = "*";
        break;
      case "2":
        years = state.year.incrementStart + "/" + state.year.incrementIncrement;
        break;
      case "3":
        state.year.specificSpecific.map((val: string) => {
          years += val + ",";
        });
        years = years.slice(0, -1);
        break;
      case "4":
        years = state.year.rangeStart + "-" + state.year.rangeEnd;
        break;
    }
    return !props.hideArr.includes("Year") ? years : "0";
  }),
  cron: computed(() => {
    return `${state.secondsText || "*"} ${state.minutesText || "*"} ${
      state.hoursText || "*"
    } ${state.daysText || "*"} ${state.monthsText || "*"} ${
      state.weeksText || "?"
    } ${state.yearsText || "*"}`;
  }),
});

watch(
  () => props.cronValue,
  (newCron) => {
    if (typeof newCron !== "string") return false;
    let crons = newCron.split(" ");
    // 解析seconds
    let secondsText = crons[0].trim();
    if (secondsText === "*") {
      state.second.cronEvery = "1";
    } else if (secondsText.includes("/")) {
      state.second.cronEvery = "2";
      let secondsTexts = secondsText.split("/");
      state.second.incrementStart = parseInt(secondsTexts[0]);
      state.second.incrementIncrement = parseInt(secondsTexts[1]);
    } else if (secondsText.includes(",") || isFinite(Number(secondsText))) {
      state.second.cronEvery = "3";
      state.second.specificSpecific = secondsText
        .split(",")
        .map((item) => parseInt(item));
    } else if (secondsText.includes("-")) {
      state.second.cronEvery = "4";
      let secondsTexts = secondsText.split("-");
      state.second.rangeStart = parseInt(secondsTexts[0]);
      state.second.rangeEnd = parseInt(secondsTexts[1]);
    }
    // 解析minutes
    let minutesText = crons[1]?.trim();
    if (minutesText === "*") {
      state.minute.cronEvery = "1";
    } else if (minutesText.includes("/")) {
      state.minute.cronEvery = "2";
      let minutesTexts = minutesText.split("/");
      state.minute.incrementStart = parseInt(minutesTexts[0]);
      state.minute.incrementIncrement = parseInt(minutesTexts[1]);
    } else if (minutesText.includes(",") || isFinite(Number(minutesText))) {
      state.minute.cronEvery = "3";
      state.minute.specificSpecific = minutesText
        .split(",")
        .map((item) => parseInt(item));
    } else if (minutesText.includes("-")) {
      state.minute.cronEvery = "4";
      let minutesTexts = minutesText.split("-");
      state.minute.rangeStart = parseInt(minutesTexts[0]);
      state.minute.rangeEnd = parseInt(minutesTexts[1]);
    }
    // 解析hours
    let hoursText = crons[2].trim();
    if (hoursText === "*") {
      state.hour.cronEvery = "1";
    } else if (hoursText.includes("/")) {
      state.hour.cronEvery = "2";
      let hoursTexts = hoursText.split("/");
      state.hour.incrementStart = parseInt(hoursTexts[0]);
      state.hour.incrementIncrement = parseInt(hoursTexts[1]);
    } else if (hoursText.includes(",") || isFinite(Number(hoursText))) {
      state.hour.cronEvery = "3";
      state.hour.specificSpecific = hoursText
        .split(",")
        .map((item) => parseInt(item));
    } else if (hoursText.includes("-")) {
      state.hour.cronEvery = "4";
      let hoursTexts = hoursText.split("-");
      state.hour.rangeStart = parseInt(hoursTexts[0]);
      state.hour.rangeEnd = parseInt(hoursTexts[1]);
    }
    // 解析days weeks
    let daysText = crons[3].trim();
    let weeksText = crons[5].trim();
    if (daysText.includes("/")) {
      state.day.cronEvery = "3";
      let daysTexts = daysText.split("/");
      state.day.incrementStart = parseInt(daysTexts[0]);
      state.day.incrementIncrement = parseInt(daysTexts[1]);
    } else if (daysText.includes(",") || isFinite(Number(daysText))) {
      state.day.cronEvery = "5";
      state.day.specificSpecific = daysText
        .split(",")
        .map((item) => parseInt(item));
    } else if (daysText === "L") {
      state.day.cronEvery = "6";
    } else if (daysText === "LW") {
      state.day.cronEvery = "7";
    } else if (daysText.endsWith("L")) {
      state.day.cronEvery = "8";
      state.day.cronLastSpecificDomDay = parseInt(daysText.replaceAll("L", ""));
    } else if (daysText.startsWith("L-")) {
      state.day.cronEvery = "9";
      state.day.cronDaysBeforeEomMinus = parseInt(
        daysText.replaceAll("L-", "")
      );
    } else if (daysText.endsWith("W")) {
      state.day.cronEvery = "10";
      state.day.cronDaysNearestWeekday = parseInt(daysText.replaceAll("W", ""));
    } else if (daysText === "?") {
      if (weeksText.includes("/")) {
        state.day.cronEvery = "2";
        let weeksTexts = weeksText.split("/");
        state.week.incrementStart = parseInt(weeksTexts[0]);
        state.week.incrementIncrement = parseInt(weeksTexts[1]);
      } else if (weeksText.includes(",") || isFinite(Number(weeksText))) {
        state.day.cronEvery = "4";
        state.week.specificSpecific = weeksText.split(",").map((item) => item);
      } else if (weeksText.includes("#")) {
        state.day.cronEvery = "11";
        let weeksTexts = weeksText.split("#");
        state.week.cronNthDayDay = parseInt(weeksTexts[0]);
        state.week.cronNthDayNth = parseInt(weeksTexts[1]);
      }
    } else {
      state.day.cronEvery = "1";
    }

    // 解析months
    let monthsText = crons[4].trim();
    if (monthsText === "*") {
      state.month.cronEvery = "1";
    } else if (monthsText.includes("/")) {
      state.month.cronEvery = "2";
      let monthsTexts = monthsText.split("/");
      state.month.incrementStart = parseInt(monthsTexts[0]);
      state.month.incrementIncrement = parseInt(monthsTexts[1]);
    } else if (monthsText.includes(",") || isFinite(Number(monthsText))) {
      state.month.cronEvery = "3";
      state.month.specificSpecific = monthsText
        .split(",")
        .map((item) => parseInt(item));
    } else if (monthsText.includes("-")) {
      state.month.cronEvery = "4";
      let monthsTexts = monthsText.split("-");
      state.month.rangeStart = parseInt(monthsTexts[0]);
      state.month.rangeEnd = parseInt(monthsTexts[1]);
    }
    // 解析years
    let yearsText = crons[6].trim();
    if (yearsText === "*") {
      state.year.cronEvery = "1";
    } else if (yearsText.includes("/")) {
      state.year.cronEvery = "2";
      let yearsTexts = yearsText.split("/");
      state.year.incrementStart = parseInt(yearsTexts[0]);
      state.year.incrementIncrement = parseInt(yearsTexts[1]);
    } else if (yearsText.includes(",") || isFinite(Number(yearsText))) {
      state.year.cronEvery = "3";
      state.year.specificSpecific = yearsText
        .split(",")
        .map((item) => parseInt(item));
    } else if (yearsText.includes("-")) {
      state.year.cronEvery = "4";
      let yearsTexts = yearsText.split("-");
      state.year.rangeStart = parseInt(yearsTexts[0]);
      state.year.rangeEnd = parseInt(yearsTexts[1]);
    }
  }
);
watch(
  () => state.cron,
  () => {
    handleChange();
  }
);
const getValue = () => {
  return state.cron;
};
const close = () => {
  emit("close");
};
const handleChange = () => {
  emit("change", state.cron);
  close();
};
const rest = (data: Array<object_Inf | string>) => {
  for (let i in data) {
    if (data[i] instanceof Object) {
      rest(data[i] as Array<object_Inf>);
    } else {
      switch (typeof data[i]) {
        case "object":
          data[i] = [];
          break;
        case "string":
          data[i] = "";
          break;
      }
    }
  }
};
</script>
<style lang="scss"></style>
